<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">

        <title>Nginx UI</title>
        <link rel="icon" type="image/png" href="{{ url_for('static', filename='nginx.ico') }}" sizes="48x48">
        <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='semantic.min.css') }}">
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
        {{ moment.include_moment() }}
        <script src="{{ url_for('static', filename='semantic.min.js') }}"></script>
        <script src="{{ url_for('static', filename='custom.min.js') }}"></script>
        <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='custom.css') }}">
    </head>
    <body>

        <div class="ui fixed inverted menu">
            <!-- Menu -->
            <div class="ui container">

                <a class="header item" href="/">
                    <img class="logo" src="{{ url_for('static', filename='nginx.png') }}">
                    Nginx UI
                </a>

                <div class="ui dropdown item" id="edit_config">
                    Main Config
                    <i class="dropdown icon"></i>
                    <div class="menu">
                        {% for name in config %}
                        <div class="config item">{{ name }}</div>
                        {% endfor %}
                    </div>
                </div>

                <a class="item" id="domains">
                    Domains
                </a>

                <div class="mobile hidden right item">
                    <div class="ui action input">
                        <input type="text" placeholder="example.com" id="add_domain">
                        <button class="ui green button" onclick="add_domain()" tabindex="0">
                            Add
                        </button>
                    </div>
                </div>

            </div>

        </div>

        <div class="ui stackable grid container" id="main-container">

            <div class="row" id="content"><!-- Content --></div>

        </div>

    </body>
</html>